<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

   Ext.onReady(function(){
   		var menu_list_Url=Ext.ContextPath+"/menu/menuList.do";
    

         // 头部的信息
   		var north_bbar=new Ext.Toolbar({});

   		north_bbar.add('->',
			{
				text:'退出',
				icon:Ext.IconPrefix+'/door_out.png',
				handler:function(){//退出	
			
					Ext.Ajax.request({
						waitTitle:"请稍候",
						method:'POST',
						url:Ext.ContextPath+"/logout.do",
						success:function(response,options){
						        //var obj= Ext.decode(response.responseText) ;//吧后台返回来的对象，转变成json    
						        
								window.location.href=Ext.ContextPath+"/login.jsp";
						},
						failure:function(response,options){//链接不上服务器的时候报的错误,业务错误不会再这里报
						        Ext.Msg.alert("错误", "与后台联系的时候出现了问题");
						}
					});	
					
				}//退出
			}
		);
		
		var logo=Ext.IconPrefix+"/HEXASLOGO.bmp";
        var north= new Ext.Panel({
        	id:"index_north",
        	frame : false,
			border : false,
			lines : false,
            region: 'north',
            height: 110, // give north and south regions a height
            html:'<img src="'+logo+'" height="80" width="209" />',
            bbar:north_bbar
        });
//        //底部的对象
//        var south={
//                // lazily created panel (xtype:'panel' is default)
//        	id:"index_south",
//                region: 'south',
//              	html:'底部',
//                split: true,
//                height: 100,
//                minSize: 100,
//                maxSize: 200,
//                collapsible: true,
//                title: '底部',
//                margins: '0 0 0 0'
//            };
        //左边菜单
        var west=new Ext.Panel({
        	//frame : false,
			//border : false,
        	id:"index_west",
			lines : false,
            region: 'west',
            title: '功能菜单',
            split: true,
            width: 200,
            minSize: 175,
            maxSize: 400,
            collapsible: true,
            margins: '0 0 0 0',
            layout: {
                type: 'accordion',
                animate: true
            }
         });
           
	        	        //设置左边菜单树例子
	        var tree = new Ext.tree.TreePanel({
	        	//frame : false,
				//border : false,
				region: 'west',
				lines : false,
	            rootVisible:false,//设为false将隐藏根节点，很多情况下，我们选择隐藏根节点增加美观性 
	            autoScroll : true,
	            margins: '0 0 0 5',
	            width: 200,
	            split:true,
	            collapsible: true,
	            useArrows: true,
    			animate: true,
	            //loader: new Ext.tree.TreeLoader({dataUrl:'menu.txt'}),
	            loader: new Ext.tree.TreeLoader(),
	            root: new Ext.tree.AsyncTreeNode({
	            	id:'root',
	            	text:'根节点',
		        	expanded: true,
		            children: [{
		                text: '发票上传',
		                leaf: true,
		                id:'fileuUpload',
		                url:'/fileUpload.jsp'
		            }, {
		                text: '未开发模块1',
		                leaf: true
		            }, {
		                text: '未开发模块2',
		                leaf: true
		            }]
		        })
	        });
	        
	        
	        //当树的节点点击的时候，就获取节点上的url属性（自己定义的），并打开这个链接
	        tree.on("click",function(node) {
	        	//如果没有url这个属性，表示没有页面和他对应
	        	if(!node.attributes.url) {
	        		return;
	        	}
	        	//alert(node.text);
	        	//当点击事件发生的时候，在panel上新打开一个tab,如果已经存在就激活它
	        	var tabId=node.id+'_TabPanel'; //tabPanel的id号
	        	var tab =centerTabPanel.getComponent(tabId);
		        	if(!tab) {
		        		//alert(node.attributes.url.substring(1,node.attributes.url.length));
		        		var url=Ext.ContextPath + node.attributes.url;//node.attributes.url.substring(1,node.attributes.url.length);
		        		tab=centerTabPanel.add({
		        			id:tabId,
		                    title: node.text,
		                    url:url,//Ext.ContextPath + node.attributes.url,
		                    //layoutOnTabChange:true,
		                    loadMask:{msg: '正在加载数据...'},
		                    //autoLoad:{url:node.attributes.url,scripts:true,params:'tabId='+tabId},//1：这种方法要考虑被载入的页面中的元素的id
		                    						//不能和这个页面一样，2：如果被Load的页面同样包含ext-base.js, ext-all.js 的文件，就不会运行代码。 
		                    html:'<iframe scrolling="auto" id="'+tabId+"_iframe"+'" frameborder="0" width="100%" height="100%" src="'+url+'?'+ escape(new Date()) +'"></iframe>',
		                    closable: true,
		                    autoScroll: true,
		                    autoDestroy:true,
		                    listeners:{'close':function(tab){
		                    		//alert(tab.getEl.dom.src);
			                    	var id_iframe=tab.id+"_iframe";
		                        	Ext.get(id_iframe).dom.src= "javascript:false"; 
		                        	id_iframe=null;
		                        	 //CollectGarbage();
		                    	}
		                    }
		                    
		            });
	        	};
	        	
	        	//激活打开的tab
	            centerTabPanel.activate(tab);
	        });
        
        //中部的内容
        // in this instance the TabPanel is not wrapped by another panel
        // since no title is needed, this Panel is added directly
        // as a Container内容
        var centerTabPanel= new Ext.TabPanel({
        		//id:"centerTabPanel",
        	id:"index_center",
            region: 'center', // a center region is ALWAYS required for border layout
            activeTab:0,
            enableTabScroll:true,
            deferredRender: false,
            plugins:new Ext.ux.TabCloseMenu() 
        });
		//alert(centerTabPanel.getTabEl(centerTabPanel.getActiveTab())); 

        var viewport = new Ext.Viewport({
        	id:"index_viewport",
        	frame : false,
			border : false,
			lines : false,
            layout: 'border',
            items: [north,tree,centerTabPanel]
        });
});

